<?php
    $fileTitle = metadata('file', array('Dublin Core', 'Title')) ? strip_formatting(metadata('file', array('Dublin Core', 'Title'))) : metadata('file', 'original filename');
?>
<?php //echo head(array('title' => $fileTitle, 'bodyclass'=>'files show primary-secondary'), 'viewer-header');
//    queue_css_url(WEB_ROOT.'/themes/longitudes/css/fontUbuntu.css');
//    queue_css_url(WEB_ROOT.'/themes/longitudes/css/layout-default-latest.css');
?>
<!DOCTYPE html>
<html>
<head>

	<title>Simple Layout Demo</title>

	<link href="http://localhost/alpha-home/longitudes/themes/longitudes/css/fontUbuntu.css" media="all" rel="stylesheet" type="text/css" >
	<link href="http://localhost/alpha-home/longitudes/themes/longitudes/css/normalize.css" media="all" rel="stylesheet" type="text/css" >
	<link href="http://localhost/alpha-home/longitudes/themes/longitudes/css/style.css" media="all" rel="stylesheet" type="text/css" >
	<link href="http://localhost/alpha-home/longitudes/themes/longitudes/css/layout-default-latest.css" media="all" rel="stylesheet" type="text/css"  />

<style type="text/css">
#itemfiles #item-images > div {
    display: inline-block;
    margin-right: 3%;
    width: 100%;
    max-width:200px;
}
.ui-layout-west, .ui-layout-center, .ui-layout-east{
	background-color:#F8F1E5;
	color:#86443C;
}
input[type="submit"], button, .button {
    background-color: #CABFA6;
}
.ui-layout-north{
	background-color: #CE6C3E;
	color:#F8F1E5;
}
</style>

	<!-- LAYOUT v 1.3.0 -->
	<script type="text/javascript" src="http://localhost/alpha-home/longitudes/themes/longitudes/javascripts/jquery-latest.js"></script>
	<script type="text/javascript" src="http://localhost/alpha-home/longitudes/themes/longitudes/javascripts/jquery-ui-latest.js"></script>
	<script type="text/javascript" src="http://localhost/alpha-home/longitudes/themes/longitudes/javascripts/jquery.layout-latest.js"></script>
	<script type="text/javascript" src="http://localhost/alpha-home/longitudes/themes/longitudes/javascripts/debug.js"></script>
	<script type="text/javascript" src="http://localhost/alpha-home/longitudes/themes/longitudes/javascripts/layout-simple.js"></script>
</head>
<body>

<div class="ui-layout-north">
	<strong><?php
	// Display parent title
	$item_id = metadata('file', 'item_id');
	$item = get_record_by_id('item', $item_id);
	set_current_record('item', $item);
	//print_r($item);
	//echo metadata('item', array('Dublin Core', 'Title'));
	echo link_to_item(metadata('item', array('Dublin Core', 'Title')));
	?></strong> &gt;
	<?php echo $fileTitle; ?>
</div>

<!-- allowOverflow auto-attached by option: west__showOverflowOnHover = true
<div class="ui-layout-west">
	<p><button onclick="myLayout.close('west')">Fermer</button></p>
</div>-->

<div class="ui-layout-south">
    <!-- The following returns all of the files associated with an item. -->
    <?php if ((get_theme_option('Item FileGallery') == 1) && metadata('item', 'has files')): ?>
    <div id="itemfiles" class="element" style="float:left;">
        <h2><?php echo __('Files'); ?></h2>
        <?php echo custom_item_image_gallery(); ?>
			<!-- this button has its event added dynamically in document.ready -->
    </div>
    <?php endif; ?>
    <div style="float:left;">
			<button class="south-toggler">Fermer</button>
    </div>
	<div style="float:left;">
		<p class="buttons">
			<button id="btnReset" class="hidden" onclick="myLayout.loadState(stateResetSettings, true)">Initialiser</button>
			&nbsp;
			<button id="toggleAllPanes">Toggle All Panes</button>
		</p>

		<p class="buttons">
			<button onclick="myLayout.toggle('north')">Toggle North Pane</button>
			&nbsp;
	<button onclick="myLayout.hide('south')">Fermer Sud</button>
		</p>

		<p class="buttons">
			<button onclick="myLayout.hide('east')">Hide East Pane</button>
			&nbsp;
			<button onclick="myLayout.show('east', false)">Unhide East (Closed)</button>
			&nbsp;
			<button onclick="myLayout.show('east')">Unhide East (Open)</button>
		</p>

		<p class="buttons">
			<button onclick="toggleLiveResizing()">Toggle Live-Resizing (all panes)</button>
			&nbsp;
			<button id="btnToggleState" onclick="toggleStateManagement()">Disable State Cookie</button>
		</p>
	</div>
</div>

<div class="ui-layout-east">
	<?php echo all_element_texts('file'); ?>
	<p><button id="btnCloseEast">Fermer</button></p>
</div>

<div class="ui-layout-center">
	<div>
	    <?php echo file_markup($file, array('imageSize'=>'fullsize')); ?>
	</div>
	<div id="format-metadata">
	    <h2><?php echo __('Format Metadata'); ?></h2>
	    <div id="original-filename" class="element">
	        <h3><?php echo __('Original Filename'); ?></h3>
	        <div class="element-text"><?php echo metadata('file', 'Original Filename'); ?></div>
	    </div>

	    <div id="file-size" class="element">
	        <h3><?php echo __('File Size'); ?></h3>
	        <div class="element-text"><?php echo __('%s bytes', metadata('file', 'Size')); ?></div>
	    </div>

	    <div id="authentication" class="element">
	        <h3><?php echo __('Authentication'); ?></h3>
	        <div class="element-text"><?php echo metadata('file', 'Authentication'); ?></div>
	    </div>
	</div><!-- end format-metadata -->
	<div id="type-metadata" class="section">
	    <h2><?php echo __('Type Metadata'); ?></h2>
	    <div id="mime-type-browser" class="element">
	        <h3><?php echo __('Mime Type'); ?></h3>
	        <div class="element-text"><?php echo metadata('file', 'MIME Type'); ?></div>
	    </div>
	    <div id="file-type-os" class="element">
	        <h3><?php echo __('File Type / OS'); ?></h3>
	        <div class="element-text"><?php echo metadata('file', 'Type OS'); ?></div>
	    </div>
	</div><!-- end type-metadata -->
	<div>
	<p class="buttons">
		<!-- these buttons have event added dynamically in document.ready -->
		<button id="closeAllPanes">Fermer</button>
		&nbsp;
		<button id="openAllPanes">Ouvrir tous les panneaux</button>
	</p>
	</div>
</div>

</body>
</html>